<template>
  <div class="modify-dialog">
    <slot> </slot>
    <el-dialog v-bind="dialogOpts" :visible.sync="dialogVisible">
      <Form v-bind="formOpts" v-on="formEvent">
        <template #formSuf>
          <el-form-item label="材料" style="width: 100%">
            <ProductInput
              mode="procureIn"
              api="procureProcureMaterials"
              :params="{ procureId: row.procureId, pageSize: 10000,pageNumber:1 }"
              v-model="arr"
            />
          </el-form-item>
        </template>
        <template #formBtn>
          <div class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="onConfirm"> 确 定 </el-button>
          </div>
        </template>
      </Form>
    </el-dialog>
  </div>
</template>

<script>
import modifyMixins from "@/mixins/modifyMixins.vue";
import ProductInput from "./ProductInput.vue";

export default {
  mixins: [modifyMixins],
  components: {
    ProductInput,
  },
  data() {
    return {
      dialogTitle: "操作入库",
      labelPosition: "left",
      dialogWidth: "60vw",
      form: {
        inVouchers: {
          tag: "Uploader",
          label: "入库凭证",
          value: [],
          props: {},
        },
      },
    };
  },
  computed: {},
  methods: {
    onSubmit(form) {
      const { modify, row, fileList } = this;
      form.procureId = row.procureId;
      form.inVouchers = form.inVouchers.join(",");
      form.materials = this.arr.map((e) => ({ count: e.count, id: e.id }));
      this.$api["procureProcureMaterialsIn"](form).then(this.submitDoneMsg);
    },
  },
};
</script>

<style lang="less" scoped></style>
